<template>
  <div>
    <h3 style="color: #9495c5">通告信息管理</h3>
    <el-main>
      <el-container style="height: 550px;padding: 10px">
        <el-table :data="tableData" max-height="600">
          <el-table-column prop="acc" label="发布者账号" width="150" fixed>
          </el-table-column>
          <el-table-column prop="type" label="通告类型" width="120">
          </el-table-column>
          <el-table-column prop="title" label="标题" width="250">
          </el-table-column>
          <el-table-column prop="bz" label="内容" width="350">
          </el-table-column>
          <el-table-column prop="fbsj" label="发布时间" width="150">
          </el-table-column>
          <el-table-column prop="enabled" :formatter="formatBoolean" label="通告状态" width="120">
          </el-table-column>
          <el-table-column prop="discordTo.name" label="通知对象" width="120">
          </el-table-column>
          <el-table-column fixed="right" label="操作" width="120">
            <template v-slot:default="scope">
              <el-popconfirm confirm-button-text='好的'
                             cancel-button-text='不用了'
                             icon="el-icon-info"
                             icon-color="red"
                             @confirm="deleteRow(scope.$index, tableData)"
                             title="确定删除吗？">
                <el-button slot="reference" type="danger" size="mini">移除</el-button>
              </el-popconfirm>
              <el-button
                size="mini"
                @click="handleEdit(scope.$index, tableData)">编辑
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <NotifyEdit ref="edit"></NotifyEdit>
      </el-container>
    </el-main>
  </div>
</template>

<script>
import NotifyEdit from '../common/notify/NotifyEdit'

export default {
  name: 'NotifyTable',
  components: {NotifyEdit},
  data () {
    return {
      visible: false,
      tableData: [{
        id: '',
        acc: '',
        type: '',
        title: '',
        bz: '',
        fbsj: '',
        enabled: '',
        discordTo: {
          id: '',
          name: ''
        }
      }]
    }
  },
  methods: {
    handleEdit (index, row) {
      this.$refs.edit.dialogFormVisible = true
      this.$refs.edit.confirmForm = row.at(index)
    },
    deleteRow (index, rows) {
      this.visible = false
      this.$axios.get('admin/notify_manager/table/' + rows.at(index).id + '/delete').then(resp => {
      }).catch(failResponse => {
        alert('服务器响应请求失败！')
      })
      rows.splice(index, 1)
    },
    formatBoolean (row, column, cellValue) {
      var ret = ''
      if (cellValue) {
        ret = '启用'
      } else {
        ret = '禁用'
      }
      return ret
    }
  },
  mounted () {
    this.$axios.get('admin/notify_manager/table/all-info').then(resp => {
      this.tableData = resp.data
    }).catch(failResponse => {
    })
  }
}
</script>

<style scoped>
.el-container {
  padding: 20px 0;
  height: 200px;
  background-color: #FFFFFF;
  border-radius: 15px;
  border: 1px solid #eaeaea;
  box-shadow: 0 0 25px #cac6c6;
}
</style>
